<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
	<h:form>
		<p:messages autoUpdate="true" closable="true" style="text-align:left"></p:messages>
		<h:panelGrid style="text-align:center;">
			<h:panelGrid columns="3" style="text-align:left;">
				<h:outputText value="Nombre de usuario"></h:outputText>
				<h:outputText value=":"></h:outputText>
				<h:inputText value="#{carroMB.usuarioReg}" required="true"
					maxlength="25" requiredMessage="Debe ingresar nombre de usuario"
					validatorMessage="nombre de usuario no valido">
					<p:ajax event="change" listener="#{carroMB.existenciaUsuario}"
						update="@form"></p:ajax>
					<f:validateRegex pattern="[a-zA-Z0-9]+" />
					<f:validateLength minimum="4" maximum="25"></f:validateLength>
				</h:inputText>

				<h:outputText value="Nombre"></h:outputText>
				<h:outputText value=":"></h:outputText>
				<h:inputText value="#{carroMB.nombreReg}" required="true"
					maxlength="25" requiredMessage="Debe ingresar nombre"
					validatorMessage="Formato de nombre no valido">
					<f:validateRegex pattern="[a-zA-Z0-9 _]+" />
					<f:validateLength minimum="4" maximum="25"></f:validateLength>
					<p:ajax event="change" listener="#{carroMB.formatoNombreRegistro}" update="@this" process="@this" />
				</h:inputText>

				<h:outputText value="Apellido"></h:outputText>
				<h:outputText value=":"></h:outputText>
				<h:inputText value="#{carroMB.apellidoReg}" required="true"
					maxlength="25" requiredMessage="Debe ingresar apellido"
					validatorMessage="Formato de apellido no valido">
					<f:validateRegex pattern="[a-zA-Z0-9 _]+" />
					<f:validateLength minimum="4" maximum="25"></f:validateLength>
					<p:ajax event="change" listener="#{carroMB.formatoApellidoRegistro}" update="@this" process="@this" />
				</h:inputText>

				<h:outputText value="Contraseña"></h:outputText>
				<h:outputText value=":"></h:outputText>
				<h:inputSecret value="#{carroMB.passReg}" required="true"
					requiredMessage="Debe ingresar contraseña"
					validatorMessage="Formato de contraseña no valido">
					<f:validateLength minimum="4" maximum="25"></f:validateLength>
					<f:validateRegex pattern="[a-zA-Z0-9]+" />
				</h:inputSecret>
			</h:panelGrid>
			<p:commandButton value="Registrarse"
				actionListener="#{carroMB.registrar}"
				update="@form, :resumenCarro, :login, :formEditarCarro"
				process="@form">
			</p:commandButton>
		</h:panelGrid>
	</h:form>
</ui:composition>